<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="jquery-3.2.1.min.js"></script>
    <script>
        function checkName() {
            return checkForm("name","nameSpan",/^[\u4e00-\u9fa5]{2,}$/,"姓名为两个以上的汉字");
        }
        function checkPwd() {
            return checkForm("pwd","pwdSpan",/^\d{6}$/,"密码为6位数字");
        }
        function checkEmail() {
            return checkForm("email","emailSpan",/^[a-zA-Z0-9]{3,}@[a-zA-Z0-9]{2,}[.](com|cn|net)$/,
                "email格式为XXX@XX.com");
        }
        function checkBirthday() {
            return checkForm("birthday","birthdaySpan",/^(19|20)\d{2}-\d{2}-\d{2}$/,"生日格式为XXXX-XX-XX");
        }

        function formSubmit() {
            var passName = checkName();
            var passPwd = checkPwd();
            var passEmail = checkEmail();
            var passBirthday = checkBirthday();

            if(passName && passPwd && passEmail && passBirthday){
                $("#f1").submit();
            }
        }

        
        function checkForm(textId,spanId,rex,errorInfo) {
           if(rex.test( $("#"+textId).val())){
               $("#"+spanId).css("color","green");
               $("#"+spanId).html("验证通过");
               return true;
           }
           else{
               $("#"+spanId).css("color","red");
               $("#"+spanId).html(errorInfo);
               return false;
           }
        }
    </script>
</head>
<body>
    <form action="add" method="get" id="f1">
        姓名：<input type="text" id="name" name="name" onblur="checkName()"><span id="nameSpan"></span><br>
        密码：<input type="password" id="pwd" name="pwd" onblur="checkPwd();"><span id="pwdSpan"></span><br>
        email：<input type="text" id="email" name="email" onblur="checkEmail();"><span id="emailSpan"></span><br>
        生日：<input type="text" id="birthday" name="birthday" onblur="checkBirthday();"><span id="birthdaySpan"></span><br>
        <input type="button" value="提交" onclick="formSubmit()">
    </form>


</body>
</html>